<script setup>
defineOptions({
  name: 'homeRecommend'
})
defineProps(['goods'])
</script>

<template>
  <van-row justify="between" class="bg-white">
    <van-col
      span="6"
      v-for="item in goods?.data.slice(0, 4)"
      :key="item.id"
      @click="$router.push(`/detail/${item.id}`)"
      class="d-flex justify-content-center align-items-start"
    >
      <van-image :src="item.cover_url" width="60%">
        <p align="center">{{ item.title }}</p></van-image
      >
    </van-col>
  </van-row>
</template>

<style scoped lang="scss">
p {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
</style>
